<template>
  <!-- 页面 -公司信息 -->
  <div 
  :class="{'innerPageTable-box-OneTwo': !useTableSearchBar}"
  class="innerPageTable-out-flex">
    <!-- 搜索区域 -->
    <SelfAdaption v-if="!useTableSearchBar">
      <Form
        :model="formSearch"
        slot="adaption-bar"
        label-position="top"
        ref="companyInfoFormSearch"
        class="ivu-form-no-margin-bottom"
        inline
      >
        <template> 
          <!-- 公司编码 -->
          <Form-item prop="companyCode" :label="$t('module.orgManage.companyCode')">
            <Input
              type="text"
              
              v-model.trim="formSearch.companyCode"
              :maxlength="30"
              :placeholder="$t('module.orgManage.pleaseInput')"
              @on-enter="search"
            ></Input>
          </Form-item>
        
          <!-- 公司名称 -->
          <Form-item prop="companyName" :label="$t('module.orgManage.companyName')">
            <Input
              type="text"
              
              v-model.trim="formSearch.companyName"
              :maxlength="30"
              :placeholder="$t('module.orgManage.pleaseInput')"
              @on-enter="search"
            ></Input>
          </Form-item>
          
          <!-- 查询\重置按钮 -->
          <Form-item prop="button" class="search-solt-btn">  
            <RPButton optType="search" @click="search" />
            <RPButton optType="reset" @click="formReset" />
          </Form-item>
             
        </template>
      </Form>
    </SelfAdaption>
    <InnerPageTable ref="companyInfoTable" :config="tableConfig"> 
      <!-- table bar 添加-->
      <div slot="table-bar">
        <div class="operate-wrapper">
          <RPButton optType="create" @click="openDialog({})" />
          <!-- <RPButton optType="delete" @click="deleted()" /> -->
          <!-- <CommonImportExport :configs="importExportConfigs"></CommonImportExport> -->
        </div>
      </div>
      <Form
        :model="formSearch"
        v-if="useTableSearchBar"
        slot="table-search-bar"
        label-position="top"
        ref="companyInfoFormSearch"
        class="ivu-form-no-margin-bottom"
        inline
      >
        <template> 
          <!-- 公司编码 -->
          <Form-item prop="companyCode">
            <Input
              type="text"
              
              v-model.trim="formSearch.companyCode"
              :maxlength="30"
              :placeholder="`${$t('module.orgManage.pleaseInput')}${$t('module.orgManage.companyCode')}`"
              @on-enter="search"
              @on-blur="search"
              @on-clear="search"
              clearable
            ></Input>
          </Form-item>
        
          <!-- 公司名称 -->
          <Form-item prop="companyName">
            <Input
              type="text"
              v-model.trim="formSearch.companyName"
              :maxlength="30"
              clearable
              :placeholder="`${$t('module.orgManage.pleaseInput')}${$t('module.orgManage.companyName')}`"
              @on-enter="search"
              @on-blur="search"
              @on-clear="search"
            ></Input>
          </Form-item>
             
        </template>
      </Form>
    </InnerPageTable>
  </div>
</template>

<script>
import CompanyEdit from "./CompanyEdit.vue";
import { getCompanyList } from "@/api/orgApi.js";
import { companyInfoColumns } from "../columns.js";
import locales from "../locales.js";
import { CoreModuleName } from "@/const.js";
import CommonImportExport from '@/components/import-and-export/index.vue'

export default {
  name: "company-info",
  mixins: [locales],
  components: {
    CommonImportExport
  },
  data() {
    return {
      // 搜索框的数据
      formSearch: {
        // tenantCode: "0000", //测试租户
        tenantCode: "",
        //enabled:null或不传enabled字段显示所有的公司。为1时为有效公司，0为无效公司。（要显示所有公司）
        companyCode: "",
        companyName: ""
      },
      loading: false,
      currentPost: null
    };
  },
  computed: {
    tableConfig() {
      return {
        loadDataFn: getCompanyList,
        columnsFn: companyInfoColumns.bind(this)
      };
    },
    importExportConfigs() {
      const apiPrefix = window?.RPConfig?.mgt || ''
      const queryTemplateParams = {
        requestPath: `${apiPrefix}/template/list`,
        requestMethod: 'post',
        requestParams: {
          templateCategory: 'COMPANY'
        }
      }
      return [
        {
          type: 'import', // 类型
          requestPath: `${apiPrefix}/company/importExcel`, // 上传接口地址
          successCallback: this.formReset // 上传成功回调
        },
        {
          type: 'export', // 类型
          btnText: '导出', // 按钮文字
          requestPath: `${apiPrefix}/company/exportExcel`, // 请求方式
          requestMethod: 'post', // 请求方式
          requestParams: {
            ...this.formSearch
          }
        },
        {
          type: 'export',
          btnText: '下载公司模板',
          exportType: 'downloadTemplate',
          requestPath: `${apiPrefix}/company/exportExcelMode`,
          requestMethod: 'post',
          requestParams: {},
          queryTemplateParams
        }
      ]
    }
  },
  created: function() {
    this.init();
  },
  mounted() {
    this.search();
  },
  methods: {
    // 查询租户编码
    init() {
      const { userInfo } = $store.state[CoreModuleName];
      if (userInfo.tenantCode) {
        this.formSearch.tenantCode = userInfo.tenantCode;
      } 
    },
    // 查询
    search(page = 1) {
      this.$refs["companyInfoTable"].load(this.formSearch, page);
    },
    // 重置
    formReset() {
      this.$refs["companyInfoFormSearch"].resetFields();
      this.$refs["companyInfoTable"].load(this.formSearch);
    },
    // 添加、编辑
    openDialog(companyInfo) {
      new this.$pageModal(
        CompanyEdit,
        {
          props: {
            tenantCode: this.formSearch.tenantCode,
            companyInfo: companyInfo
          }
        },
        data => {
          if (data) {
            this.search(this.$refs.companyInfoTable.param.pageNum);
          }
        }
      );
    }
  }
};
</script>
